<input id="current-view-url" type="hidden" value="<?= \yii\helpers\Url::to() ?>">
<?php
$js = <<<JS
    var pageIndex = 1; //页面索引初始值
    var pageSize = 12; //每页显示条数初始化
    var url=$('#current-view-url').val();
    var hideColumn=[];
    loadData(url,pageIndex,pageSize);

    function loadData(url,page,pageSize){
        var param=new Object();
        param.page=page;
        param.pageSize=pageSize;
        if($('#search-handle').length>0){//length的作用是输出元素的个数，$('#search-handle').length意为输出#search-handle元素个数
            param.searchData=getElementValueObject('search');//根据class名称取得表单项的值存储到对象,search为搜索项的类名,返回的是一个对象，打印的字符串形如{"tel":"","name":"","qrcode":""}
        }
        //table
        $("tbody").empty().remove();
        $("#tablesaw").find('thead').after("<tbody id='place1'></tbody>");
        var tbody = $( '#place1' ), props = [],mydata=[];
        $.each($('#tablesaw th'), function(i, prop){
             props[i]=$(this).attr('scope');
        });
         $.post(url,{_csrf:$('meta[name=csrf-token]').attr('content'),param:JSON.stringify(param)},function(data){
             mydata=data.data;
             $.each($('#tablesaw th'), function(i, prop){
                 if($(this).hasClass('tablesaw-cell-hidden')){
                      hideColumn[i]=prop.scope;
                 }
             });
             hideColumn=$.grep(hideColumn, function(n) {return $.trim(n).length > 0;});
            $.each(mydata, function(i, value){
                var tr = $('<tr>').attr('row-index',i);
                $.each(props, function(j, prop){
                    if(prop=='tablesaw-number'){
                         $('<td>').attr('data-field','tablesaw-number').html(i+1).appendTo(tr);
                    }else{
                        if(hideColumn && jQuery.inArray(prop,hideColumn)!=-1){
                            $('<td>').attr('data-field',prop).addClass('tablesaw-cell-hidden').html(value[prop]).appendTo(tr);
                        }else{
                            $('<td>').attr('data-field',prop).removeClass('tablesaw-cell-hidden').html(value[prop]).appendTo(tr);
                        }
                    }
                });
                tbody.append(tr);
            });
            if(data.content!=null){
                $('#data_totals').html(data.content);
            }
            //分页
            if(data.pages!=null){
            pagination(data.pages.totalCount,page);
            }
         });
     }
     //调整窗口事件
    var resizeTimer = null;
    $(window).resize(function(){
    if (resizeTimer) clearTimeout(resizeTimer);
        resizeTimer = setTimeout(resize,100);
    });
    $('.tablesaw-nav-btn').click(function(){
        if (resizeTimer) clearTimeout(resizeTimer);
        resizeTimer = setTimeout(resize,100);
    });
    //分页
    $(document).on('click','#dropdownlist_pagination-text',function(){
        $('#dropdownlist_pagination-option ul').toggle();
    });
    $(document).on('click','#dropdownlist_pagination-option ul li',function(){
        $('#dropdownlist_pagination-option ul').toggle();
         loadData(url,$(this).val(),pageSize);
    });
    $(document).on('click','#last-next-button div',function(){
        if($(this).find('span').data('page')!=0){
             loadData(url,parseInt($(this).find('span').data('page')),pageSize);
        }
    });

    //为选中的行更改背景色
    $("#tablesaw").on('click','tbody tr',function() {
        $(this).find('td').addClass("zx_table_selected").end().siblings().find('td').removeClass("zx_table_selected");
    });
    function pagination(totalcount,page){
         var total_pages=Math.ceil(totalcount/pageSize);
         var paginationHtml='';
         var page_next=(page+1)>total_pages?0:(page+1);
         var page_number=page==total_pages?totalcount:page*pageSize;
         paginationHtml += '<div id="pagination_footer" class="yx-floatr zx-mg-floatr"><p class="yx-floatl yx-color73bbef yx-font13 yx-lh24">' +"显示"+((page-1)*pageSize+1)+"到"+page_number+"条，共"+totalcount+"条记录" +'</p>' +
         '<div class="diy_select diy_select1 yx-radius3">' +'<div id="dropdownlist_pagination-text" class="select-text">' +
         '<input type="hidden" name="" id="a" class="span11 diy_select_input">' +
         '<div class="diy_select_txt diy_select_txt1 yx-font13 yx-lh22">' +page+'/'+pageSize + '</div>' +'<div class="diy_select_btn diy_select_btn1"></div>' +'</div>' +
         '<div id="dropdownlist_pagination-option" class="select-option">' +'<ul class="diy_select_list diy_select_list1 yx-radius3">';
         for(var i=1;i<=total_pages;i++){
            paginationHtml +=  '<li value='+i+'><div class="yx-radius50 yx-list-style"></div>'+i+'/'+pageSize+'</li>' ;
         }
         paginationHtml+='</ul>' +'</div>' +'</div>' +'<div id="last-next-button" class="yx-floatl">';
         paginationHtml+='<div class="yx-last-list yx-floatl">' +'<span data-page='+(page-1)+'><img src="images/last.png"></span></div>';
         paginationHtml+='<div class="yx-next-list yx-floatl">' +'<span data-page='+page_next+'><img src="images/next.png"></span></div>';
         paginationHtml+='</div><div class="yx-clear"></div></div><div class="yx-clear"></div>';
         $("#pagination_footer").empty().remove();
         $('#tablesaw').parent().after(paginationHtml);
          if(page!=1){
           $('.yx-last-list').css({"border-color": "#c9c9c9", "background": "#fff" });
         }else{
            $('div[class=yx-last-list]').css({"border-color": "#e8e8e8", "background": "#e8e8e8" });
         }
          if(page==total_pages){
            $('.yx-next-list').css({"border-color": "#e8e8e8", "background": "#e8e8e8" });
         }else{
            $('.yx-next-list').css({"border-color": "#c9c9c9", "background": "#fff" });
         }
    }
    //搜索
    $('#search-handle').click(function(){
        loadData(url,pageIndex,pageSize);
    });
    //
    function reloadData(){
        loadData(url,pageIndex,pageSize);
    }
    //窗口调节大小时,向前向后按钮
    function resize(){
         hideColumn=[];
         $.each($('#tablesaw th'), function(i, prop){
             if($(this).hasClass('tablesaw-cell-hidden')){
                  hideColumn[i]=prop.scope;
             }
         });
         hideColumn=$.grep(hideColumn, function(n) {return $.trim(n).length > 0;});
        if(hideColumn){
            $.each($('#place1 tr'),function(i, value){
                $(this).find('td').each(function(){
                    if(jQuery.inArray($(this).data('field'),hideColumn)!=-1){
                        $(this).addClass('tablesaw-cell-hidden');
                    }else{
                        $(this).removeClass('tablesaw-cell-hidden');
                    }
                })
            });
        }
    }
JS;
$this->registerJS($js);
